<template>
    <div class="doc_detail" v-if="data">
        <div ref="table-wrap">
            <h3 style="margin:5px 0;text-align:center">文件传阅单</h3>
            <table cellpadding="0" cellspacing="0" border="0" width="100%" class="ourtable">
                <tr>
                    <td rowspan="2">来文机关</td>
                    <td rowspan="2">{{data.civil_service.zh || data.civil_service.mn}}</td>
                    <td>收文时间</td>
                    <td colspan="2">{{ data.receipt_time }}</td>
                </tr>
                <tr>
                    <td>登记文号</td>
                    <td colspan="2">{{ data.document_code }}</td>
                </tr>
                <tr>
                    <td>来文字号</td>
                    <td>{{ data.letter_number.zh || data.letter_number.mn }}</td>
                    <td>等级</td>
                    <td colspan="2">{{ data.grade.zh || data.grade.mn }}</td>
                </tr>
                <tr>
                    <td>文件题目</td>
                    <td colspan="4">{{ data.title.zh }}</td>
                </tr>
                <tr>
                    <td>拟办意见</td>
                    <td colspan="4" v-html="data.options.zh"></td>
                </tr>
                <tr>
                    <td>领导批示</td>
                    <td colspan="4">
                        <p v-for="item in data.pishi" :key="item.id" style="display:flex;padding-left:7px">
                            <span>{{item.teacher.teacher_name?item.teacher.teacher_name.zh:item.teacher.teacher_name.mn}}： </span>
                            <span v-html="item.approval.zh"></span>
                        </p>
                    </td>
                </tr>
                <tr>
                    <td :rowspan="data.school_leader.length+1">校级领导签收</td>
                    <td class="w">姓名</td>
                    <td class="w">阅文时间</td>
                    <td class="w">姓名</td>
                    <td class="w">阅文时间</td>
                </tr>
                <tr v-for="(item,ind) in data.school_leader" :key="ind">
                    <td class="w">{{item[0].teacher.teacher_name.zh}}</td>
                    <td class="w">{{item[0].is_look?item[0].updated_at:'未阅读'}}</td>
                    <td class="w">{{item[1]?(item[1].teacher.teacher_name.zh):''}}</td>
                    <td class="w">{{item[1]?(item[1].is_look?item[1].updated_at:'未阅读'):''}}</td>
                </tr>
                <tr v-if="!data.other_leader.length">
                    <td>科室领导签收</td>
                    <td class="w"></td>
                    <td class="w"></td>
                    <td class="w"></td>
                    <td class="w"></td>
                </tr>
                <tr v-if="data.other_leader.length">
                    <td :rowspan="data.other_leader.length">科室领导签收</td>
                    <td class="w">{{data.other_leader[0][0].teacher.teacher_name.zh}}</td>
                    <td class="w">{{data.other_leader[0][0].is_look?data.other_leader[0][0].updated_at:'未阅读'}}</td>
                    <td class="w">{{data.other_leader[0][1]?(data.other_leader[0][1].teacher.teacher_name.zh):''}}</td>
                    <td class="w">{{data.other_leader[0][1]?(data.other_leader[0][1].is_look?data.other_leader[0][1].updated_at:'未阅读'):''}}</td>
                </tr>
                <tr v-if="data.other_leader.length>1" v-for="(item,ind) in data.other_leader.slice(1)" :key="ind">
                    <td class="w">{{item[0].teacher.teacher_name.zh}}</td>
                    <td class="w">{{item[0].is_look?item[0].updated_at:'未阅读'}}</td>
                    <td class="w">{{item[1]?item[1].teacher.teacher_name.zh:''}}</td>
                    <td class="w">{{item[1]?(item[1].is_look?item[1].updated_at:'未阅读'):''}}</td>
                </tr>
                <tr>
                    <td>备注</td>
                    <td colspan="4">
                        <p v-for="item in data.teacher" :key="item.id" style="display:flex;padding-left:7px">
                            <span>{{item.teacher.teacher_name?item.teacher.teacher_name.zh:item.teacher.teacher_name.mn}}： </span>
                            <span v-html="item.content"></span>
                        </p>
                    </td>
                </tr>
            </table>
        </div>
        <div class="examine">
            <p class="tt">下发的教师：</p>
            <p v-for="(tc,i) in data.to_teacher" :key="i"> &nbsp;&nbsp; {{tc.teacher.teacher_name.zh}}： &nbsp;&nbsp; {{tc.is_look?'已查看':'未查看'}}</p>
        </div>
        <div class="examine">
            我的意见：&nbsp; &nbsp;{{data.my_option?data.my_option.approval?data.my_option.approval.zh?data.my_option.approval.zh:'暂无意见':'暂无意见':'暂无意见'}}
        </div>
        <div class="examine">
            上级意见：&nbsp; &nbsp;{{data.leader_option?(data.leader_option.content?(data.leader_option.content.zh?data.leader_option.content.zh:'暂无意见'):'暂无意见'):'暂无意见'}}
        </div>
        <div class="examine">附件：&nbsp;&nbsp; 
            <p v-for="itm in data.file" :key="itm.id" style="padding-left:20px">
                <a :href="itm.content" target="_blank" :download="itm.file_name">{{itm.file_name}}</a>
            </p>
            <span v-if="data.file.length==0">无</span>
        </div>
        <div v-for="item in data.examine" :key="item.id">
            <div class="examine">审核人：&nbsp;&nbsp; {{item.examine.teacher_name.zh}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 审核状态：&nbsp;&nbsp; <span v-html="getstatus(item.status)"></span>
            <br>审核时间：&nbsp;&nbsp;{{item.status==0?'':item.updated_at}}
            </div>
        </div>
            <Form ref="loginForm" :model="form" :rules="rules">
                <div style="margin-bottom:23px" v-if="data.user_type=='1'">
				<p style="margin-bottom:10px">批示：</p>
                <Input v-model="form.approval.zh" type="textarea" :rows="4" placeholder="输入批示..."></Input>
			</div>
            <div style="margin-bottom:23px">
				<p style="margin-bottom:10px">备注：</p>
                <Input v-model="form.content.zh" type="textarea" :rows="4" placeholder="输入备注..."></Input>
			</div>
			<FormItem label="继续传阅" prop='teacher'>
				<Input v-model="exnameteacher" @on-focus="modalteacher=true" placeholder="选择查阅人"  type="textarea" :autosize="{minRows: 2,maxRows: 5}"></Input>
			</FormItem>
            <div style="text-align:center">
                <Button type="primary" @click="moralAdd" :loading="loading" long>提交</Button> &nbsp;&nbsp;
            </div>
            </Form>
            <!-- <Modal v-model="modalteacher" title="选择查阅人" @on-cancel="cancelstatus" width="350">
			<Input v-model="seartxt" size="small" placeholder="搜索人员" style="width: 300px;" @on-change="toSearch(seartxt)"/>
			<div style="min-height:250px;margin-top:10px;height:400px;overflow:auto">
				<CheckboxGroup v-model="form.teacher">
					<div v-for="item in examiners" :key="item.user_id" style="margin-bottom:2px"><Checkbox :label="item.user_id">
						{{item.teacher_name?item.teacher_name:item.teacher_name.mn}}</Checkbox></div>
				</CheckboxGroup>
			</div>
		</Modal> -->
        <Modal v-model="modalteacher" title="选择查阅人" @on-cancel="cancelstatus" width="350">
			 <div style="text-align:center;margin-bottom:10px">
				<RadioGroup v-model="partype" type="button" size="small" @on-change="ptchange">
					<Radio label="dus">职务</Radio>
					<Radio label="dep">所有人</Radio>
				</RadioGroup>
			</div>
			<Input v-model="seartxt" size="small" placeholder="搜索人员"  @on-change="toSearch(seartxt)" v-if="partype=='dep'" style="width: 300px;"/>
			<Select v-model="dutie_id" v-if="partype=='dus'" size="small" @on-change="chax">
				<Option :value="item.value" v-for="(item,ind) in duties" :key="ind">{{item.title.zh}}</Option>
			</Select>
			<div style="min-height:250px;margin-top:10px;height:400px;overflow:auto">
				<CheckboxGroup v-model="form.teacher">
					<div v-for="item in wonima" :key="item.user_id" style="margin-bottom:2px"><Checkbox :label="item.user_id">
						{{item.teacher_name?item.teacher_name.zh:item.teacher_name.mn}}</Checkbox></div>
				</CheckboxGroup>
			</div>
		</Modal>
    </div>
</template>

<script>

export default {
    props:{
        id: Number,
        userId: Number,
    },
    data () {
        return {
            upload_url: this.$api+'/api/user/v1/editor/upload?module=documents',
            upload_token: localStorage.token,
            partype: 'dus',
            dutie_id: '',
            seartxt: '',
            duties: [],
            data: null,
            form:{
				teacher:[],
                approval:{
					zh:'',
					en:'',
					mn:'',
				},
                content:{
                    zh:'',
					en:'',
					mn:'',
                }
			},
			loading: false,
			modalteacher:false,
            seartxt: '',
            examiners: [],
			examiners_copy: [],
            wonima:[],
            rules: {
				// 'teacher': [
				// 	{ required: true,type:'array', message: '至少选择一个传阅人', trigger: 'change', }
				// ],
			},
        }
    },
    methods: {
        panHide() {
            this.$emit('close')
            this.$emit('reload')
		},
        load() {
            this.$http.get('api/document/v1/document/getone/'+this.id).then(res=> {
                this.data = res.data
                console.log(res.data)
            }).catch(err=> console.log(err))
        },
        getstatus(status) {
            switch(status) {
                case 0: return '<span style="color:#ff9900">未审核</span>'
                case 1: return '<span style="color:#19be6b">通过审核</span>'
                case 2: return '<span style="color:#ed3f14">未通过审核</span>'
                case 3: return '<span style="color:#007d7f">待上级处理</span>'
            }
        },
        zwload() {
			this.$http.get('api/user/v1/get/duties/list').then(res=> {
				this.duties = res.data.map(item=> ({
                    value: item.id,
                    title: item.duties_name
                }))
			}).catch(
				err => this.$Message.error('职务加载失败！')
			)
        },
        cancelstatus(){
			this.form.teacher = []
			this.seartxt = ''
        },
        // 点击添加按钮将数据发送给后端
		moralAdd() {
					// this.loading = true
					// this.$http.post('api/document/v1/document/official_document/'+this.id,this.form).then(val=> {
					// 	if(val.code==200) {
					// 		this.panHide();
					// 		this.loading = false
					// 	} else {
					// 		this.loading = false
					// 	}
					// })
                    if(this.data.user_type=='1'){
                        this.form.user_type = '1'
                    }else{
                        delete this.form.approval
                    }
            this.$refs.loginForm.validate((valid) => {
				if (valid) {
					this.loading = true
					this.$http.post('api/document/v1/document/official_document/'+this.id,this.form).then(val=> {
						if(val.code==200) {
							this.panHide();
							this.loading = false
						} else {
							this.loading = false
						}
					})
				} else {
					this.$Message.error('验证失败！');
				}
			})
		},
        ptchange(type) {
            if(type=='dep') {
				this.wonima = this.examiners_copy
			} else {
				this.wonima = []
				this.dutie_id = ''
			}
        },
        chax(id) {
            let url = `api/user/v1/get/teacher/user/list?duties_id=[${id}]`
			this.$http.get(url).then(res=>{
				this.wonima = res.data
			}).catch(
				err => this.$Message.error('人员获取失败！')
			)
        },
		// 搜索人员
		toSearch(txt) {
			if(txt.length!=0) {
				this.wonima = this.examiners_copy.filter(item=> {
					return new RegExp(txt).test(item.teacher_name.zh)
				})
			} else {
				this.wonima = this.examiners_copy
			}
		},
		getExamine(){
			this.$http.get('api/user/v1/get/teacher/user/list').then(val=>{
                // val.data.splice(val.data.findIndex(item=>item.user_id==this.userId),1)
				this.examiners = val.data
                this.wonima = []
				this.examiners_copy = val.data
			}).catch(
				err => console.log(err)
			)
		},
        print() {
            let oldstr = document.body.innerHTML
            var newstr = this.$refs['table-wrap'].innerHTML
            document.body.innerHTML = newstr
            window.print()
            window.location.reload()
            document.body.innerHTML = oldstr
            return false
        }
    },
    computed: {
		exnameteacher(){
			if(this.form.teacher.length>0){
				let arrar= []
				this.form.teacher.forEach(el=>{
				this.examiners.forEach(item=>{
					if(el==item.user_id){
						arrar.push(item.teacher_name?item.teacher_name.zh:'')
					}
				})
			})
			return arrar.join(',')
			}
		},
		
	},
    created(){
        this.load()
        this.getExamine()
        this.zwload()
    }
} 
</script>


<style lang="less" scoped>
.doc_detail {
    .title {
        text-align: center;
        margin: 8px 0 4px 0;
    }
    .sub_title {
        text-align: right;
        padding-bottom: 7px;
        border-bottom: 1px solid #ddd;
    }
    .content {
        padding: 7px 0;
        border-bottom: 1px solid #ddd;
    }
    .examine {
        font-size: 14px;
        font-weight: 400;
        border: 1px solid #ddd;
        padding: 7px 11px;
        margin-top: 12px;
        background: #f5f5f5;
        .tt {
            margin-bottom: 4px;
        }
    }
    .reseve {
        border-top: 1px solid #ddd;
        margin-top: 12px;
        p {
            font-size: 13px;
            padding: 8px 0 4px 0;
            font-weight: 500;
        }
    }
}
.ourtable {
    border-top: 1px solid #666;
    border-left: 1px solid #666;
    tr {
        text-align: center;
        td {
            border-bottom: 1px solid #666;
            border-right: 1px solid #666;
            padding: 8px 5px;
            &.w {
                width: 21%;
                height: 40px;
            }
        }
    }
}
</style>